import { InfoCircleOutlined } from '@ant-design/icons';
import { Area, Column } from '@ant-design/plots';
import { Col, Progress, Row, Tooltip } from 'antd';
import numeral from 'numeral';
import type { DataItem } from '../data.d';
import useStyles from '../style.style';
import { ChartCard, Field } from './Charts';
import {codeHits} from '@/services/ant-design-pro/dashboard';
const topColResponsiveProps = {
  xs: 24,
  sm: 12,
  md: 12,
  lg: 12,
  xl: 8,
  style: {
    marginBottom: 24,
  },
};
const IntroduceRow = ({ loading, visitData }: { loading: boolean; visitData: DataItem[] }) => {
  const { styles } = useStyles();
  console.log(visitData,'--visitData')
  return (
    <Row gutter={24}>
      {visitData.map((item) => {
        return (
          <Col  key={item.title} {...topColResponsiveProps}>
        <ChartCard
         
          bordered={false}
          loading={loading}
          title={ item.buttonName  }
          total={numeral(item.hitCount).format('0,0')}
          contentHeight={46}
        >

        </ChartCard>
      </Col>
        )
      })
}
     
    </Row>
  );
};
export default IntroduceRow;
